<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('商户会员充值')"/>
</head>
<body class="white-bg">
<div class="wrapper wrapper-content animated fadeInRight ibox-content">
    <form class="form-horizontal m" id="form-member-recharge">
        <input name="deptId"  type="hidden"  id="deptId"/>
        <div class="form-group">
            <label class="col-sm-3 control-label is-required">会员卡号：</label>
            <div class="col-sm-8">
                <div class="input-group">
                    <input name="memberCardNumber" readonly="readonly" onclick="selectMemberTree()"
                           id="memberCardNumber" type="text" placeholder="请选择会员卡号" class="form-control" required>
                    <span class="input-group-addon"><i class="fa fa-search"></i></span>
                </div>
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-8 col-sm-offset-3">
                <div class="table">
                    <table id="bootstrap-table"></table>
                </div>
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">充值金额(本金)：</label>
            <div class="col-sm-8">
                <input name="consumeAmount" class="form-control" type="text"  >
            </div>
        </div>
        <div class="form-group">
            <label class="col-sm-3 control-label">活动金额(赠送)：</label>
            <div class="col-sm-8">
                <input name="givingAmount" class="form-control" type="text" placeholder="0" >
            </div>
        </div>
    </form>
</div>
<th:block th:include="include :: footer"/>
<script th:inline="javascript">
    /*<![CDATA[*/
    var sexData = [[${@dict.getType('sys_user_sex')}]];
    var optMemberOrder = [[${optMemberOrder}]];
    /*]]>*/
    $(function() {
        var options = {
            pagination: false,
            showSearch: false,
            showRefresh: false,
            showToggle: false,
            showColumns: false,
            sidePagination: "client",
            columns: [
                {
                    field: 'deptName',
                    title: '门店名称'
                },
                {
                    field: 'userName',
                    title: '姓名'
                },
                {
                    field: 'gender',
                    title: '性别',
                    formatter: function (value, row, index) {
                        return $.table.selectDictLabel(sexData, value);
                    }
                },
                {
                    field: 'mobile',
                    title: '手机号码'
                },
                {
                    field: 'balance',
                    title: '余额',
                    formatter: function (value, row, index) {
                        return '<span style="color: red">'+value+'</span>'
                    }
                }
            ]
        };
        $.table.init(options);

        if(optMemberOrder) {
            $("#memberCardNumber").val(optMemberOrder.memberCardNumber);
            $("#deptId").val(optMemberOrder.deptId);
            sub.addColumn(optMemberOrder);
        }
    });

    jQuery.validator.addMethod("price", function (value, element) {
        var price = reg= /^(-?\d+)(\.\d{1,2})?$/;
        return this.optional(element) || (price.test(value));
    }, "小数点后最多为两位");

    var prefix = ctx + "operator/order"

    $("#form-member-recharge").validate({
        rules:{
            consumeAmount: {
                // required: true,    //要求输入不能为空
                number: true,     //输入必须是数字
                // min: 1,          //输入的数字最小值为0.01，不能为0或者负数
                // digits:true,
                price: true
            },
            givingAmount:  {
                // required: true,    //要求输入不能为空
                number: true,     //输入必须是数字
                // min: 0,          //输入的数字最小值为0.01，不能为0或者负数
                price: true
            },
        },
        messages: {
            "memberCardNumber": "请选择需要操作的用户",
            "consumeAmount": {
                // required: "请填写充值金额",
                number: "请正确输入金额",
                // digits: "充值金额必须为整数",
                // min: "输入最小金额为1",
            },
            "givingAmount": {
                // required: "请填写充值金额",
                number: "请正确输入金额",
                // min: "输入最小金额为0.01",
            }
        },

        focusCleanup: true
    });
    function submitHandler() {
        if ($.validate.form()) {
            $.operate.save(prefix + "/recharge", $('#form-member-recharge').serialize(), function () {
                if (parent.reload && typeof parent.reload == "function") {
                    parent.reload();
                }
            });

        }
    }

    /*用户管理-新增-选择会员树*/
    function selectMemberTree() {
        if (optMemberOrder) return
        var url = ctx + "operator/member/selectMemberTree";
        $.modal.open('选择会员', url, 380);
    }
    function selectMember(member) {
        $('#bootstrap-table').bootstrapTable('removeAll');
        $("#memberCardNumber").val(member.memberCardNumber);
        $("#deptId").val(member.deptId);
        sub.addColumn(member);
        $("#memberCardNumber").blur();
    }


</script>
</body>
</html>